<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米音箱秒杀</title>
    <link rel="icon" href="/mi/imgs/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="/mi/css/common/header.css">
    <link rel="stylesheet" type="text/css" href="/mi/css/boxseckill/boxseckill.css">
    <link rel="stylesheet" href="/mi/css/iconfont/iconfont.css">
    <link rel="stylesheet" href="/mi/plugins/layui-v2.6.8/layui/css/layui.css">
    <link rel="stylesheet" href="/mi/css/common/header.css">
</head>

<body>
<%@include file="../common/header.jsp" %>
<!---------- 导购界面-->
<div class="menu_shop">

    <!-- ------------头部图片 -->
    <div class="menu_shop_head">
    </div>
    <div class="container">
        <!-- ----------闪购 导航-->
        <div class="menu_shop_nav">
            <ul id="tabs">
                <li class="active">
                    <em>18:00</em>
                    <span><em>距开始还剩</em>&nbsp;
                        <em id="box_seckill_time"></em>
                    </span>
                </li>
                <li><em>20:00</em><span>即将开始</span></li>
                <li><em>22:00 </em> <span>即将开始</span></li>
                <li><em>00:00 </em><span>即将开始</span></li>
                <li><em>08:00 </em><span>即将开始</span></li>
            </ul>
        </div>
        <!-- ------商品展示 -->
        <div class="menu_shop_goods" id="lists">

            <ul class="clearfix active1">
                <c:forEach items="${boxSeckillList}" var="everybox" varStatus="b">
                <li>
                    <input type="hidden" id="seckilltime1" value="${seckillTimeList.get(b.index)}">
                    <div class="bg">
                        <img src="${boxproduct.get(b.index).picImg}">
                    </div>
                    <div class="info">
                        <div style="height: 120px;">
                            <a href="" class="name">${boxproduct.get(b.index).productName}</a>
                            <p>${boxproduct.get(b.index).introduce}</p>
                            <p><span>${everybox.seckillprice}元 </span>
                                <del>${boxproduct.get(b.index).price}元</del>
                            </p>
                        </div>
                        <a onclick="startSeckill()" class="btn" style="cursor: pointer" >抢购</a>
                        <p>已有8352人设置提醒</p>
                    </div>
                </li>

                </c:forEach>

            </ul>
            <ul class="clearfix">


                <li>
                    <div class="bg">
                        <img src="https://cdn.cnbj0.fds.api.mi-img.com/b2c-shopapi-pms/pms_1617775981.5269965.jpg">
                    </div>
                    <div class="info">
                        <div style="height: 120px;">
                            <a href="" class="name">小米AI音箱（第二代）</a>
                            <p>小米AI音箱（第二代）</p>
                            <p><span>99元 </span>
                                <del>199元</del>
                            </p>
                        </div>
                        <a href="" class="btn">抢购</a>
                        <p>已有3921人设置提醒</p>
                    </div>
                </li>

            </ul>
            <ul class="clearfix">
                <li>
                    <div class="bg">
                        <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/8c52f60113b2e235544abca95d6687f4.jpg">
                    </div>
                    <div class="info">
                        <div style="height: 120px;">
                            <a href="" class="name">小米小爱触屏音箱Pro 8</a>
                            <p>8英寸平板级大屏</p>
                            <p><span>599元 </span>
                                <del>660元</del>
                            </p>
                        </div>
                        <a href="" class="btn">抢购</a>
                        <p>已有832人设置提醒</p>

                    </div>


                </li>


            </ul>
            <ul class="clearfix">
                <li>
                    <div class="bg">
                        <img src="https://cdn.cnbj0.fds.api.mi-img.com/b2c-shopapi-pms/pms_1575427252.04796744.jpg">
                    </div>
                    <div class="info">
                        <div style="height: 120px;">
                            <a href="" class="name">Redmi小爱音箱 Play</a>
                            <p>听音乐、语音遥控家电的人工智能音箱</p>
                            <p><span>89元 </span>
                                <del>129元</del>
                            </p>
                        </div>
                        <a href="" class="btn">抢购</a>
                        <p>已有832人设置提醒</p>


                    </div>


                </li>

            </ul>
            <ul class="clearfix">
                <li>
                    <div class="bg">
                        <img src="https://cdn.cnbj0.fds.api.mi-img.com/b2c-shopapi-pms/pms_1617775981.5269965.jpg">
                    </div>
                    <div class="info">
                        <div style="height: 120px;">
                            <a href="" class="name">小米AI音箱（第二代）</a>
                            <p>小米AI音箱（第二代）</p>
                            <p><span>99元 </span>
                                <del>199元</del>
                            </p>
                        </div>
                        <a href="" class="btn">抢购</a>
                        <p>已有3921人设置提醒</p>
                    </div>

                </li>


            </ul>

        </div>
        <p class="menu_shop_notice">*小米闪购活动规则:小米闪购商品部享受该商品在小米商城的其他优惠政策(包括不限于优惠券,赠品,满减,满赠等)<br>
            温馨提示:因可能存在系统缓存,页面更新导致价格变动异常等不确定性因素情况出现,如您发现活动商品标价或促销信息有异常,请您立刻联系小米客服,以便我们及时补正</p>
    </div>

</div>
<!-- 底部公共部分 -->
<%@include file="../common/page-bottom.jsp" %>
<script src="/mi/plugins/jquery/jquery.min.js"></script>
<script src="/mi/plugins/layui-v2.6.8/layui/layui.js"></script>
<script type="text/javascript" src="/mi/js/boxseckill/boxseckill.js"></script>
<script>
    function startSeckill() {
        $.post('/mi/seckillBox',{killId:1},function (res) {
            console.log(res)
            if (res.code=="200"){
                layer.msg(res.data,{icon:1});
            }else {
                console.log(res.data)
                layer.msg(res.data,{icon:2});
                console.log(res)
            }
        })
    }

</script>
</body>

</html>